<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的购物车</title>
<link rel="stylesheet" href="css/shopCar.css">
<script src="js/jquery.min.js"></script>
</head>
<body>
	<div id="box">
		<header>
			<a href="index.jsp">
				<img src="images/tmall.png" alt="网络出错了" id="logo">
			</a>
		</header>
			<div id="coverDiv"></div>
		<div class ="mydiv"></div>
		<div id="header">
			<div class="myheader">
				<div class="header_left">
					<img src="images/shouye.webp" class="shouyeImg">
					<a href="index.jsp">天猫首页</a>&nbsp;&nbsp;
					<span>喵，欢迎来天猫</span>&nbsp;&nbsp;
					<c:choose>
						<c:when test="${!empty loginUser }">
							<span>欢迎你，${loginUser.userName}</span>
						</c:when>
						<c:otherwise>
							<a href="login.jsp">请登录</a>&nbsp;&nbsp;
						</c:otherwise>
					</c:choose>
					<a href="register.jsp">免费注册</a>
				</div>
				<div class="header_right">
					<a href="#">官网首页</a>&nbsp;&nbsp;
					<div class="myshow1">
						<a href="#" class="mymove1">我的淘宝</a>&nbsp;&nbsp;
						<div id="mytaobao">
							<a href="#">已买到的宝贝</a><br>
							<a href="#">已卖出的宝贝</a>
						</div>
					</div>
					<img src="images/car.png">
					<a href="#">购物车</a>&nbsp;&nbsp; 
					<div class="myshow2">
						<a href="collect.do" class="mymove2">收藏夹</a>&nbsp;&nbsp;|&nbsp;&nbsp;	
						<div id="shoucangjia">
							<a href="#">收藏的宝贝</a><br>
							<a href="#">收藏的店铺</a>
						</div>
					</div>
					
					<a href="#">商品分类</a>&nbsp;&nbsp;
					<a href="#">免费开店</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;
					<a href="#">千牛卖家中心</a>&nbsp;&nbsp;
					<a href="#">联系客服</a>
				</div>
			</div>
		</div>
		<div id="mysearch">
			<div id="mydiv">
				<div class="myimg">
					<img src="images/tmallLogo.png" alt="">
				</div>
				<div class="search">
					<form action="" method="post">
						<input type="text" placeholder = "宝贝">
						<input type="submit" value="搜索">
					</form>
				</div>
			</div>
		</div>
		<div id="tbody">
			<div class="top1">
				<div class="top1_left">
					购物车（全部0）
					<!--全部数量需要结合实际的购物车数量修改 -->
				</div>
				<div class="top1_right">
					已选商品，不含运费：<span>￥0.00</span>
					<!-- 商品具体费用-->
					<input type="button" value="结算">
				</div>
			</div>
			<div class="top2">
				<table>
					<tr>
						<td>
							<a href="#">
								<input type="checkbox" value="choose" class="allChoose">全选
							</a>
						</td>
						<td>商品信息</td>
						<td>单价</td>
						<td>数量</td>
						<td>金额</td>
						<td>操作</td>
					</tr>
				</table>
			</div>
			<div id="top3">
				<div class="div1">
					<div class="div1_top">
						<input type="checkbox" calss="xuan" value="">
					</div>
					<div class="div1_bottom">
						<table cellspacing="0" cellpadding="0">
							<tr>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td>
									<a class="delete">删除</a>
								</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
			<div id="top4">
				<div class="top4_left">
					<a href="#">
						<input type="checkbox" value="choose" class="allChoose">全选&nbsp;&nbsp;
					</a>
					<a class="allDel">删除</a>
				</div>
				<div class="top4_right">
					<a href="#">已选商品<span>0</span>件</a>&nbsp;&nbsp;
					合计（不含运费）<span>￥0.00</span>&nbsp;&nbsp;
					<a href="#">
						<input type="button" value="结算" class="buyGoods">
					</a>
				</div>
			</div>
		</div>
		<div id = "myfooter">
			<div class="footer_footer">
				<a href="#">关于天猫</a>
				<a href="#">商家服务大厅</a>
				<a href="#">开放平台</a>
				<a href="#">诚聘英才</a>
				<a href="#">联系我们</a>
				<a href="#">网站合作</a>
				<a href="#">法律声明</a>
				<a href="#">隐私权政策</a>
				<a href="#">知识产权</a>
				<a href="#">廉正举报</a>
				<a href="#">不当竞争举报</a><br>
				<a href="#">阿里巴巴集团</a>
				<a href="#">&nbsp;|&nbsp;淘宝网</a>
				<a href="#">&nbsp;|&nbsp;天猫</a>
				<a href="#">&nbsp;|&nbsp;聚划算</a>
				<a href="#">&nbsp;|&nbsp;全球速卖通</a>
				<a href="#">&nbsp;|&nbsp;阿里巴巴国际交易市场</a>
				<a href="#">&nbsp;|&nbsp;1688</a>
				<a href="#">&nbsp;|&nbsp;阿里妈妈</a>
				<a href="#">&nbsp;|&nbsp;飞猪</a>
				<a href="#">&nbsp;|&nbsp;阿里云计算</a>
				<a href="#">&nbsp;|&nbsp;AliOS</a>
				<a href="#">&nbsp;|&nbsp;阿里通信</a>
				<a href="#">&nbsp;|&nbsp;万网</a>
				<a href="#">&nbsp;|&nbsp;高德</a>
				<a href="#">&nbsp;|&nbsp;UC</a>
				<a href="#">&nbsp;|&nbsp;友盟</a>
				<a href="#">&nbsp;|&nbsp;虾米</a>
				<a href="#">&nbsp;|&nbsp;钉钉</a>
				<a href="#">&nbsp;|&nbsp;支付宝</a>
				<a href="#">&nbsp;|&nbsp;阿里安全</a><br>
				
				<span>
					增值电信业务经营许可证：浙B2-20110446&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;市场名称登记证：工商网市字3301004119号 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出版物网络交易平台服务经营备案证： 新出发浙备字第2019002号
				</span><br>
				<span>
					互联网违法和不良信息举报电话：0571-81683755 blxxjb@alibaba-inc.com&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;互联网药品信息服务资质证书编号：浙-（经营性）-2017-0005&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="images/TB1yEqRPXXXXXXPXpXXXXXXXXXX-20-20.png" alt="">浙公网安备 33010002000120号
				</span><br>
				<span>
					医疗器械网络交易服务第三方平台备案：（浙）网械平台备字[2018]第00002号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 网络文化经营许可证：浙网文 [2021]1668-073号&nbsp;<img src="images/O1CN01VEHhJi1T2RCHFYS81_!!6000000002324-1-tps-65-70.gif" alt="" class="myFooterImg">
				</span><br>
				<span>浙江省网络食品销售第三方平台提供者备案：浙网食A33010002&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;12318举报&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;浙B2-20110446-1</span><br>
				<span>&copy;2003-现在 TMALL.COM 版权所有</span><br>
				<div class="myFooterImg2">
					<img src="images/O1CN01Hs1MVu1IDvM07YrGh_!!6000000000860-2-tps-293-143.png" alt="">
				</div>
			</div>
		</div>

	</div>
	<input type="hidden" id="username" value="${loginUser.userName}">
	<input type="hidden" id="password" value="${loginUser.passWord}">
</body>
<script src="js/shopcar.js" language="JavaScript"></script>
<script src="js/jquery.min.js"></script>
<script>
load();

	$(".delete").click(function(){
		$.ajax({
			url:"/shopping/delGoods.do",
			type:"GET",
			data:{
				"userId":${loginUser.userId},
				"goodsId":$(".goodsId")
			},
			success:function(data){
				
			}
		})
	})

	$(".buyGoods").click(function(){
			var arr = [];
			var $theche =$("input:checked").parent(".div1_top").next().children().children().children().children().children(".goodsId").each(function(){
				var res = $(this).text();
				arr.push(res);
			});
		
		var price=0 ;
		var $theche1 =$("input:checked").parent(".div1_top").next().children().children().children().children().children(".price").each(function(){
			var res = $(this).text();
			price += Number(res);
		});
		
		if(prompt("是否付款",price)){
			alert("此处为二维码");
			$.ajax({
				type:"GET",
				data:{
					"goodsIds":arr,
					"userId":${loginUser.userId},
					"sumPrice":price
				},
				success:function(data){//此处为添加商品到订单表并查询订单并删除购物车内的商品
					alert("订单已生成，请注意查看");
					$("input:checked").parent(".div1_top").parent().remove();//删除已选的商品
					
					
					for(var i = 0; i < data.length;i++){//请参考orderType类
						var $div = $("<div class='orderDiv'></div>");
						var $orderId = $("<span></span>").text(data[i].orderId);
						var $fare = $("<span></span>").text(data[i].fare);
						var $farerential = $("<span></span>").text(data[i].farerential);
						var $sendout = $("<span></span>").text(data[i].sendout);
						var $takeover =  $("<span></span>").text(data[i].takeover);
						$div.append($orderId).append($fare).append($farerential).append($sendout).append($takeover);
						$.ajax({
							url:"/shopping/OrderType.do",
							type:"POST",
							data:{
								"goodsId":data[i].goodsId
							},
							success:function(data){//此处内容为详细商品  请参考goods类
								$goodsId = $("<span></span>").text(data.goodsId);//商品id
								$gName = $("<span></span>").text(data.gName);//商品介绍
								$gPrice = $("<span></span>").text(data.gPrice);//商品价格
								$gType = $("<span></span>").text(data.gType);//类性
								
								$gImage = $("<img>").attr({src:data.gImage,alt:"图片走丢了"});
								$busineId = $("<span></span>").text(data.busineId);
								$div.append($goodsId).append($gName).append($gPrice).append($gType).append($gImage).append($busineId);
							}
						});
						$("#mysearch").after().append($div);
					}
				}
			});
		};
		
	});
	
	function load(){
		var num = new Array();
		$.ajax({
			url:"/shopping/getGoodsNum.do",
			type:"GET",
			data:{
				"username":$("#username").val(),
				"password":$("#password").val()
			},
			success:function(data){
				for (var i = 0; i < data.length; i++) {
					num.push(data[i].goodsNum);
				}
			}
		})
		
		$.ajax({
			url:"/shopping/shopCar.do",
			type:"GET",
			data:{
				"username":$("#username").val(),
				"password":$("#password").val()
			},
			success:function(data){
				for (var i = 0; i < data.length; i++) {
					var $img = $("<img class='goods_image'>").attr({src:data[i].gImage,alt:"图片走丢了"}).height(140);
					var $gName = $("<div class='goodsName'></div>").text(data[i].gName);
					var $price = $("<span class='price'></span>").text(data[i].gPrice);
					var $num = $("<span class='goodsId'></span>").text(data[i].goodsId);
					var $div = $(".div1").clone();
					$num.hide();
					$div.attr("display","inline-block");
					$div.attr("class","div"+(i+2));
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(1)").append($img);
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(2)").append($gName);
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(3)").append($num);
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(4)").append($price);
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(5)").text(num[i]);
					$div.children(".div1_bottom").children().children().children().children("td:nth-of-type(6)").append(data[i].gPrice*num[i]); 
					$("#top3").append($div);
				}
			}
		})
		
	}
	
</script>
</html>